/**
 * Created by fangshufeng on 2017/9/22.
 */

import  React from 'react';


class ListOfWords extends React.PureComponent {
    render() {
        return <div>{this.props.words.join(',')}</div>;
    }

}

let DataSouce = {

};

export default  class TextPurecomponent extends React.Component {
    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            words: ['marklar'],
        };
        this.handleClick = this.handleClick.bind(this);
      }

    handleClick() {
        // This section is bad style and causes a bug
        const words = this.state.words;
        words.push('marklar');
        this.setState({words: words});

        DataSouce.addChangeListener();
    }

    render()
    {
        return (
            <div>
                <button onClick={this.handleClick}/>
                <ListOfWords
                    words={this.state.words}
                />
            </div>
        );
    }
}